<%@ page language="java" import="java.util.*" pageEncoding="utf-8"%>
<%@ page import="vo.BookBean"%>
<%
	String path = request.getContextPath();
	String basePath = request.getScheme() + "://"
			+ request.getServerName() + ":" + request.getServerPort()
			+ path + "/";

%>

<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN">
<html>
	<head>
		<base href="<%=basePath%>">

		<title>My JSP 'querybook.jsp' starting page</title>

		<meta http-equiv="pragma" content="no-cache">
		<meta http-equiv="cache-control" content="no-cache">
		<meta http-equiv="expires" content="0">
		<meta http-equiv="keywords" content="keyword1,keyword2,keyword3">
		<meta http-equiv="description" content="This is my page">
		<!--
	<link rel="stylesheet" type="text/css" href="styles.css">
	-->
		<style type="text/css">
* {
	font-size: 12px;
}
#topdiv{
	width:980px;
	height:800px;
	
}
#vvv{
font-size:20px;
}
table{
margin-left: 180px;
}
input{
margin-left: 150px;
}
#di{
    width: 600px;
	height: 20px;
	font-size:20px;
	color:red;
	margin-left: 150px;
}
p{
font-size:20px;
color:blue;
}
#qq{
font-size:20px;
}
b1 {
	width: 80px;
}

.a {
	width: 500px;
}

td {
	padding-left: 35px;
}

#adiv {
	width: 600px;
	height: 500px;
	margin-left: 150px;
}

#bdiv {
	width: 25%;
	height: 50%;
	float: left;
}

#cdiv {
	width: 25%;
	height: 50%;
	float: left;
}

#ddiv {
	width: 25%;
	height: 50%;
	float: left;
}

#ediv {
	width: 25%;
	height: 50%;
	float: left;
}

#fdiv {
	width: 25%;
	height: 50%;
	float: left;
}

#gdiv {
	width: 25%;
	height: 50%;
	float: left;
}

#hdiv {
	width: 25%;
	height: 50%;
	float: left;
}

#idiv {
	width: 25%;
	height: 50%;
	float: left;
}

.d1 {
width:150px;
height:20px;
	text-align: center;
	padding-top: 5px;
}
.d2 {
	text-align: center;
	padding-top: 20px;
}

img {
	padding-top: 15px;
	padding-left: 10px;
	padding-bottom: 10px;
}

.b2 {
	width: 60px;
}

#bb {
	width: 80px;
}
#divd{
padding-top: 30px;
	width: 25%;
	height: 50%;
    float:left;
}
#divc{
padding-top: 42px;
	width: 25%;
	height: 50%;
float:left;
}
.c{
padding-top: 8px;
}
a{
text-decoration:none
}
#ss{

	width: 600px;
	height: 25px;;
	text-align:center;
	margin-left: 150px;
}
</style>
<script type="text/javascript" src="js/jquery-1.7.2.js"></script>
<script type="text/javascript">
$(document).ready(function(){
	$.post("<%= basePath%>jsp/booklistservlet",b,"json");}
);
function b(data){
	$("#adiv").empty();
	for(i in data.aa){
	var b_name=data.aa[i].b_name;
	var b_num=data.aa[i].b_num;
	var b_image=data.aa[i].b_image;
	var c="";
	if(b_num==0){
	    c="已借完";
}else{
		c="借出";
	}
	$("#adiv").append("<div id='bdiv'><div><a href='javascript:void(0);' onclick='getSrc(this)'><img src='"+b_image+"' /></a>"+
			"</div><div class='d1'><a href='javascript:void(0);' onclick='aa(this)'>"+b_name+"</a></div><div class='d2'>库存："+b_num+"</div><div class='d1'>"+
			"<button class='b2' id='btn5'><a href='jsp/bookBorrow.jsp' id='a8'>"+c+"</a></button>&nbsp;<button class='b2'><a href='book/bookreturn_list'>归还</a>"+
			"</button></div></div>");
	if(c=="已借完"){
		$("#a8").remove();
		$("#btn5").append(c);
		$("#btn5").attr("disabled",true);
	}
	}
	$("#ss").empty();
for(i in data.ys){
  $("#ss").append("<button><a href='javascript:void(0);' onclick='ff(this)'>第"+data.ys[i]+"页</a></button>");
}
}
$(document).ready(function(){

$("#bb").click(function(){
var obj={};
obj.b_name=$("#bb").prev().val();
if(obj.b_name!=null){
$.post("<%= basePath%>jsp/queryservlet",obj,a,"json");}
	

});
});
function a(data){
	$("#di").empty();
	var c=$(".a").val();
	if(c==""){$("#di").append("请输入查询内容！");}else{
	$("#di").append("和<a id='vvv'>"+c+"</a>相似的有以下书籍");}
$("#adiv").empty();
if(data.ss==""){
	$("#adiv").append("<p>对不起没有和您查询所匹配的书籍！</p>");
	
}else{
for(i in data.ss){
var b_name=data.ss[i].b_name;
var b_num=data.ss[i].b_num;
var b_image=data.ss[i].b_image;
$("#adiv").append("<div id='bdiv'><div><a href='javascript:void(0);' onclick='getSrc(this)'><img src='"+b_image+"' /></a>"+
		"</div><div class='d1'><a href='javascript:void(0);' onclick='aa(this)'>"+b_name+"</a></div><div class='d2'>库存："+b_num+"</div><div class='d1'>"+
		"<button class='b2'><a href='jsp/bookBorrow.jsp'>借出</a></button>&nbsp;<button class='b2'><a href='book/bookreturn_list'>归还</a>"+
		"</button></div></div>");}
$("#ss").empty();
for(i in data.ys){
	  $("#ss").append("<button><a href='javascript:void(0);' onclick='rr(this)'>第"+data.ys[i]+"页</a></button>");
	}
}}
function rr(s){
	var value=$(s).text();
	var name=$("#vvv").text();
	var obj={};
	obj.v=value;
	obj.b_name=name;
	if(value!="第1页"){
		$.post("<%= basePath%>jsp/queryservlet",obj,a,"json");
		
	}else{
		var name=$("#vvv").text();
		var obj={};
		obj.b_name=name;
		$.post("<%= basePath%>jsp/queryservlet",obj,a,"json");
		
	}
}
function xx(a){
var c=$(a).text();
var obj={};
obj.type=c;
$.post("<%=basePath%>jsp/fenleiservlet",obj,x,"json");
$("#di").empty();
$("#di").append("欢迎来到<a id='qq'>"+c+"</a>区");
}
function x(data){
	$("#adiv").empty();
    for(i in data.dd){
	var b_name=data.dd[i].b_name;
	var b_num=data.dd[i].b_num;
	var b_image=data.dd[i].b_image;
	$("#adiv").append("<div id='bdiv'><div><a href='javascript:void(0);' onclick='getSrc(this)' ><img src='"+b_image+"' /></a>"+
	"</div><div class='d1'><a href='javascript:void(0);' onclick='aa(this)'>"+b_name+"</a></div><div class='d2'>库存："+b_num+"</div><div class='d1'>"+
	"<button class='b2'><a href='jsp/bookBorrow.jsp'>借出</a></button>&nbsp;<button class='b2'><a href='book/bookreturn_list'>归还</a>"+
	"</button></div></div>");}
	$("#ss").empty();
	for(i in data.ys){
		  $("#ss").append("<button><a href='javascript:void(0);' onclick='gg(this)'>第"+data.ys[i]+"页</a></button>");
		}
	}
function gg(a){
	var value=$(a).text();
	var obj={};
	obj.v=value;
	var type=$("#qq").text();

	   obj.type=type;
	if(value!="第1页"){
        $.post("<%= basePath%>jsp/fenleiservlet",obj,x,"json");
		
	}else{
		var obj={};
		obj.type=type;
		$.post("<%= basePath%>jsp/fenleiservlet",obj,x,"json");
		
	}
}
function aa(x){
   var name=$(x).html();
   var obj={};
   obj.name=name;
   $.post("<%= basePath%>jsp/nameservlet",obj,s,"json");
}
function s(data){
	$("#adiv").empty();
	for(i in data.name){
      var b_name=data.name[i].b_name;
      var type=data.name[i].b_type;
      var b_num=data.name[i].b_num;
      var b_price=data.name[i].b_price;
      var b_author=data.name[i].b_author;
      var b_press=data.name[i].b_press;
      var b_image=data.name[i].b_image;
      var b_type="";
      if(type=="0"){
      	b_type="小说";
		   }else if(type=="1"){
			   b_type="文学";
		   }else if(type=="2"){
			   b_type="计算机";
		   }else if(type=="3"){
			   b_type="金融";
		   }else if(type=="4"){
			   b_type="历史";
		   }else if(type=="5"){
			   b_type="心理学";
		   }
      $("#adiv").append("<div id='divd'><img src='"+b_image+"' /></div><div id='divc'><div class='c'>书名:"+b_name+"</div>"+
    	      "<div class='c'>类型:"+b_type+"</div><div class='c'>售价:"+b_price+"</div><div class='c'>数量:"+b_num+"</div><div class='c'>作者:"+b_author+"</div>"+
    	      "<div class='c'>出版社:"+b_press+"</div></div>");

		}
	  $("#ss").empty();
}
function getSrc(a){ 
  var image=$(a).children().attr("src");
  var o={};
  o.image=image;

  $.post("<%= basePath%>jsp/imageservlet",o,vv,"json");
}
function vv(data){

	$("#adiv").empty();
	for(i in data.image){
      var b_name=data.image[i].b_name;
      var type=data.image[i].b_type;
      var b_num=data.image[i].b_num;
      var b_price=data.image[i].b_price;
      var b_author=data.image[i].b_author;
      var b_press=data.image[i].b_press;
      var b_image=data.image[i].b_image;
      var b_type="";
      if(type=="0"){
      	b_type="小说";
		   }else if(type=="1"){
			   b_type="文学";
		   }else if(type=="2"){
			   b_type="计算机";
		   }else if(type=="3"){
			   b_type="金融";
		   }else if(type=="4"){
			   b_type="历史";
		   }else if(type=="5"){
			   b_type="心理学";
		   }
      $("#adiv").append("<div id='divd'><img src='"+b_image+"' /></div><div id='divc'><div class='c'>书名:"+b_name+"</div>"+
    	      "<div class='c'>类型:"+b_type+"</div><div class='c'>售价:"+b_price+"</div><div class='c'>数量:"+b_num+"</div><div class='c'>作者:"+b_author+"</div>"+
    	      "<div class='c'>出版社:"+b_press+"</div></div>");
	} $("#ss").empty();
		}
function ff(a){
var value=$(a).text();
var obj={};
obj.v=value;

if(value!="第1页"){
	$.post("<%= basePath%>jsp/booklistservlet",obj,b,"json");
	
}else{
	$.post("<%= basePath%>jsp/booklistservlet",b,"json");
	
}}



</script>

	</head>
<body>
<div id="topdiv">
		<input type="text" name="b_name" class="a" />
		&nbsp;&nbsp;
		<button id="bb" >
			查询
		</button>
		<table id="t1">
			<tr>
				<td>
					<a href="javascript:void(0);" onclick="xx(this)">小说</a>
				</td>
				<td>
					<a href="javascript:void(0);" onclick="xx(this)">文学</a>
				</td>
				<td>
					<a href="javascript:void(0);" onclick="xx(this)">计算机</a>
				</td>
				<td>
					<a href="javascript:void(0);" onclick="xx(this)">金融</a>
				</td>
				<td>
					<a href="javascript:void(0);" onclick="xx(this)">历史</a>
				</td>
				<td>
					<a href="javascript:void(0);" onclick="xx(this)">心理学</a>
				</td>
			</tr>
		</table>
		<div id="di"></div>
		<div id="adiv"></div>
		<div id="ss"></div>
		</div>
	</body>
</html>
